<template class="index_background">
  <div class="index_background">
    <el-collapse>
    <div class="top1">
      <h5 align="left">企业信息管理>企业信息</h5>
      </div>
      <div class="rowwd">
        <el-row>
          <el-col :span="24" >
          <div class="title1" style="border-bottom:3px solid #eee">
            <div class="title2">
            <h2 align="left">企业基本信息
            <!-- <el-button @click="dialogFormVisible1=true" @click='edit'>修改</el-button> -->
             <el-button @click='edit'>修改</el-button>
            </h2>
            </div>
          </div>
          </el-col>
        </el-row>
        <div>
        <el-row >
          <el-col :span="8"><div class="info1">企业名称：<div>{{EntInfo.ename}}</div></div></el-col>
          <el-col :span="8"><div class="info1">企业ID：<div>{{EntInfo.eid}}</div></div></el-col>
          <el-col :span="8"><div class="info1">目前用户ID：<div>{{EntUser.uid}}</div></div></el-col>
        </el-row>
        <el-divider></el-divider>
        <el-row>
          <el-col :span="8"><div class="info1">联系方式：<div>{{EntInfo.contact}}</div></div></el-col>
          <el-col :span="8"><div class="info1">企业规模：<div>{{EntInfo.scale | scale}}</div></div></el-col>
          <el-col :span="8"><div class="info1">企业类型：<div>{{EntInfo.type | type}}</div></div></el-col>
        </el-row>
        <el-divider></el-divider>
        <el-row>
          <el-col :span="16"><div class="info1">企业地址：<div>{{EntInfo.location}}</div></div></el-col>
        </el-row>
        <el-divider></el-divider>
        <el-row>
          <el-col :span="12"><div class="info2">企业logo：<div><img :src="EntInfo.logo" class="avatar"></div></div></el-col>
        </el-row>
        <el-divider></el-divider>
        <el-row>
          <el-col :span="24"><div class="info3"><h1>企业介绍：</h1></div></el-col>
          <el-col :span="24"><div class="info3"><div>{{EntInfo.intro}}</div></div></el-col>
        </el-row>
        </div>
        <div class="rowwd">
        <el-row>
          <el-col :span="24">
            <div class="title1" style="border-bottom:3px solid #eee">
              <h2 align="left">绑定信息</h2>
            </div>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12"><div class="info1">企业手机号：
          <div class="info4">{{EntUser.utel}}</div>
            <!--el-button @click="dialogFormVisible2=true">修改</el-button-->
          </div></el-col>
        </el-row>
        <el-divider></el-divider>
        <el-row>
          <el-col :span="12"><div class="info1">企业邮箱：
          <div class="info4">{{EntUser.umail}}</div>
          <!--el-button @click="dialogFormVisible3=true">修改</el-button-->
          </div></el-col>
        </el-row>
        <el-divider></el-divider>
        <el-row>
          <el-col :span="12"><div class="info2">企业营业执照：<div> <img :src="EntInfo.auditFile" class="avatar"></div></div></el-col>
        </el-row>
        </div>
        </div>
    </el-collapse>

<el-dialog title="基本信息修改" :visible.sync="dialogFormVisible1" width="600px">
  <el-form :model="enditEntinfo">
    <el-form-item label="联系方式" label-width="120px" align="left">
      <el-input v-model="enditEntinfo.contact" autocomplete="off" style="width:300px"></el-input>
    </el-form-item>
    <el-form-item label="企业规模" label-width="120px" align="left">
      <el-select v-model="enditEntinfo.scale" placeholder="请选择企业规模">
        <el-option label="小于150人" :value='0'></el-option>
        <el-option label="150-500人" :value='1'></el-option>
        <el-option label="500-2000人" :value='2'></el-option>
        <el-option label="2000人以上" :value='3'></el-option>
      </el-select>
      </el-form-item>
      <el-form-item label="企业类型" label-width="120px" align="left">
      <el-select v-model="enditEntinfo.type" placeholder="请选择企业类型">
        <el-option label="互联网" :value=1></el-option>
        <el-option label="金融" :value=2></el-option>
        <el-option label="快消" :value=3></el-option>
        <el-option label="传媒" :value=4></el-option>
        <el-option label="餐饮" :value=5></el-option>
        <el-option label="教育" :value=6></el-option>
        <el-option label="化工" :value=7></el-option>
        <el-option label="其他" :value=0></el-option>
      </el-select>
    </el-form-item>
    <el-form-item label="企业地址" label-width="120px" align="left">
      <el-input v-model="enditEntinfo.location" autocomplete="off" style="width:400px"></el-input>
    </el-form-item>
    <el-form-item label="企业logo" label-width="120px" align="left">
      <!-- <el-upload v-model="EntInfo.logo"
      class="avatar-uploader"
      action="http://106.53.200.72:8080/file/upload"
      :show-file-list="false"
      :on-success="handleAvatarSuccess"
      :before-upload="beforeAvatarUpload">
      <img v-if="imageUrl" :src="imageUrl" class="avatar">
      <i v-else class="el-icon-plus avatar-uploader-icon"></i>
    </el-upload> -->
    <el-upload v-model="enditEntinfo.logo"
      class="avatar-uploader"
      action="http://106.53.200.72:8080/file/upload"
      :show-file-list="false"
      :on-success="handleAvatarSuccess">
      <img v-if="enditEntinfo.logo" :src="enditEntinfo.logo" class="avatar">
      <!-- <i v-else class="el-icon-plus avatar-uploader-icon"></i>
       <i class="el-icon-plus avatar-uploader-icon"></i> -->
    </el-upload>
    </el-form-item>
    <el-form-item label="企业介绍" label-width="120px" align="left">
      <el-input type="textarea" v-model="enditEntinfo.intro" autocomplete="off" style="width:400px"></el-input>
    </el-form-item>
  </el-form>
  <div slot="footer" class="dialog-footer">
    <el-button @click="dialogFormVisible1 = false">取 消</el-button>
    <!-- <el-button type="primary" @click="dialogFormVisible1 = false">确 定</el-button> -->
      <el-button type="primary" @click="submit">确 定</el-button>
  </div>
</el-dialog>

<!--
<el-dialog title="企业手机号修改" :visible.sync="dialogFormVisible2" width="600px">
  <el-form :model="form1">
    <el-form-item label="修改后的手机号" label-width="120px" align="left">
      <el-input v-model="form1.utel" autocomplete="off" style="width:300px"></el-input>
      <el-button>发送验证码</el-button>
    </el-form-item>
    <el-form-item label="验证码" label-width="120px" align="left">
      <el-input v-model="form1.check" autocomplete="off" style="width:300px"></el-input>
    </el-form-item>
  </el-form>
  <div slot="footer" class="dialog-footer">
    <el-button @click="dialogFormVisible2 = false">取 消</el-button>
    <el-button type="primary" @click="dialogFormVisible2 = false">确 定</el-button>
  </div>
</el-dialog>

<el-dialog title="企业邮箱修改" :visible.sync="dialogFormVisible3"  width="600px">
  <el-form :model="form1">
    <el-form-item label="修改后的邮箱号" label-width="120px" align="left">
      <el-input v-model="form1.umail" autocomplete="off" style="width:300px"></el-input>
      <el-button>发送验证码</el-button>
    </el-form-item>
    <el-form-item label="验证码" label-width="120px" align="left">
      <el-input v-model="form1.check" autocomplete="off" style="width:300px"></el-input>
    </el-form-item>
  </el-form>
  <div slot="footer" class="dialog-footer">
    <el-button @click="dialogFormVisible3 = false">取 消</el-button>
    <el-button type="primary" @click="dialogFormVisible3 = false">确 定</el-button>
  </div>
</el-dialog>
-->

<!--el-dialog title="企业介绍修改" :visible.sync="dialogFormVisible4" width="600px">
  < <el-form :model="form1"> >
  <el-form>  
    <el-form-item label="企业介绍" label-width="120px" align="left">
      <el-input type="textarea" v-model="EntInfo.intro" autocomplete="off" style="width:400px"></el-input>
    </el-form-item>
  </el-form>
  <div slot="footer" class="dialog-footer">
    <el-button @click="dialogFormVisible1 = false">取 消</el-button>
    <el-button type="primary" @click="changeEntInfo(EntInfo)">确 定</el-button>
  </div>
</el-dialog-->

</div>
</template>

<style>
.title1{
  background:rgb(250,250,250);
  height: 50px;
  align-items: center;
  justify-content: left;
  display: flex;
}
.info1{
  align-items: center;
  justify-content: left;
  display:flex;
}
.info2{
  height: 200px;
  justify-content: left;
  display:flex;
}
.info3{
  width:1000px;
  justify-content: left;
  display:flex;
  float:left;
  word-wrap:break-word;
  word-break:break-all;
  text-align:left;
}
.info4{
  width:250px;
  justify-content: left;
  display:flex;
  float:left;
  text-align:left;
}
.top1{
   margin:30px 0;
   color: rgb(144,144,144);
   height: 50px;
   }
.index_background{
   background:white;
   }
  .back2{
    background:tomato;
  }
  .lable{
    color: rgb(144,144,144);
    margin-top: 20px;
    margin-left: -400px;
    margin-bottom: 100px;
  }
  .center{
    margin-top: 100px;
    margin-left: 500px;
  }
  .demo-ruleForm {
    
    margin-bottom: 300px;
  }

  .set {
    width:500px;
    margin-top: 21px;
    font-size: 14px;
    color: #909399
  }

  .btn {
    background: rgb(24,144,255);
    color: white;
    position: relative;
    top: 100px;
    left: 200px;
  }

  .settinginput {
    width: 500px;
  }
  .rowwd{
  width:1000px;
  }
  .el-row {
    margin-bottom: 20px;
  }
  .el-col {
    border-radius: 4px;
  }
  .bg-purple-dark {
    background: #99a9bf;
  }
  .bg-purple {
    background: #d3dce6;
  }
  .bg-purple-light {
    background: #e5e9f2;
  }
  .grid-content {
    border-radius: 4px;
    min-height: 36px;
  }
  .row-bg {
    padding: 10px 0;
    background-color: #f9fafc;
  }
  .avatar-uploader .el-upload {
    border: 1px dashed #d9d9d9;
    border-radius: 6px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
  }
  .avatar-uploader .el-upload:hover {
    border-color: #409EFF;
  }
  .avatar-uploader-icon {
    font-size: 28px;
    color: #8c939d;
    width: 178px;
    height: 178px;
    line-height: 178px;
    text-align: center;
  }
  .avatar {
    width: 178px;
    height: 178px;
    display: block;
  }
</style>

<script>/* eslint-disable indent */

  import fetch from '../api/fetch'

  export default{
    data(){
      return{
        dialogFormVisible4: false,
        enditEntinfo: {},
        EntInfo:{
          eid:'',
          ename: '',
          logo: '',
          type: 0,
          scale: 0,
          auditFile: '',
          location: '',
          contact: '',
          intro: '',
          violationTimes:0,
        },
        EntUser:{},
        dialogFormVisible1: false
      }
    },
    mounted(){
      this.init();
    },
    filters: {
      scale(scale){
        if(scale ==0 ){
          return '小于150人'
        } else if (scale== 1) {
          return '150-500人'
        } else if (scale== 2) {
          return '500-2000人'
        } else if (scale== 3) {
          return '2000人以上'
        } else {
          return '';
        }
      },
      type(type) {
        if(type ==0 ){
          return '其他'
        } else if (type== 1) {
          return '互联网'
        } else if (type== 2) {
          return '金融'
        } else if (type== 3) {
          return '快消'
        } else if (type== 4) {
          return '传媒'
        } else if (type== 5) {
          return '餐饮'
        } else if (type== 6) {
          return '教育'
        } else if (type== 7) {
          return '化工'
        } else {
          return '';
        } 
      }
    },
    methods:{
      init() {
        this.getmyEntInfo(1001),
        this.getmyEntUserInfo(223)
      },
      edit() {
        console.log(this.EntInfo);
        this.enditEntinfo = JSON.parse(JSON.stringify(this.EntInfo));
        this.dialogFormVisible1 = true;
      },
      async submit() {
        const result = await fetch.editEntInfoController(this.enditEntinfo);
        if (result && result.data && result.data.code === 200) {
          alert(result.data.msg);
          this.init();
          this.dialogFormVisible1 = false;
        }
       
      },
      handleAvatarSuccess(res, file) {
      },
      getmyEntInfo(eid) {
        fetch.getmyEntInfo(eid).then(res =>{
        console.log(res)
        this.EntInfo=res.data.EntInfo;
        // if(res.data.EntInfo.type==0){this.EntInfo.type='其他'};
        // if(res.data.EntInfo.type==1){this.EntInfo.type='互联网'};
        // if(res.data.EntInfo.type==2){this.EntInfo.type='金融'};
        // if(res.data.EntInfo.type==3){this.EntInfo.type='快消'};
        // if(res.data.EntInfo.type==4){this.EntInfo.type='传媒'};
        // if(res.data.EntInfo.type==5){this.EntInfo.type='餐饮'};
        // if(res.data.EntInfo.type==6){this.EntInfo.type='教育'};
        // if(res.data.EntInfo.type==7){this.EntInfo.type='化工'};
        // if(res.data.EntInfo.scale==0){this.EntInfo.scale='小于150人'};
        // if(res.data.EntInfo.scale==1){this.EntInfo.scale='150-500人'};
        // if(res.data.EntInfo.scale==2){this.EntInfo.scale='500-2000人'};
        // if(res.data.EntInfo.scale==3){this.EntInfo.scale='2000人以上'};
      })
    },
    getmyEntUserInfo(uid) {
      fetch.getmyEntUserInfo(uid).then(res =>{
        console.log(res)
        this.EntUser=res.data
      })
    },
    changeEntInfo(formname){
      let form1={
        eid:1001,
        ename:this.EntInfo.ename,
        logo:this.EntInfo.logo,
        type:this.EntInfo.type,
        scale:this.EntInfo.scale,
        auditFile:this.EntInfo.auditFile,
        location:this.EntInfo.location,
        contact:this.EntInfo.contact,
        intro:this.EntInfo.intro,
        violationTimes:this.EntInfo.violationTimes
      }
    },
  }
}  
</script>
